import 'package:flutter/material.dart';

class ConstraintTestRoute extends StatefulWidget {
  const ConstraintTestRoute({super.key});

  // 这里变量的类型换成State才不会有警告。但不知道会不会有其它影响
  @override
  State<ConstraintTestRoute> createState() => _ConstraintTestRouteState();
}

class _ConstraintTestRouteState extends State<ConstraintTestRoute> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("测试一些布局相关的东西")),
      backgroundColor: const Color.fromARGB(0, 1, 1, 12),
      body: getContentView(),
    );
  }
}

Widget getContentView() {
  return Column(
    children: [
      ConstrainedBox(
        constraints: const BoxConstraints(
          minHeight: 45,
          minWidth: 220,
        ),
        child: OutlinedButton(
          onPressed: () {},
          child: const Text("有被约束的按钮"),
        ),
      ),
      OutlinedButton(
        onPressed: () {},
        child: const Text("没约束的按钮"),
      ),
      Row(
        children: [
          getConstrainedImage(),
          const SizedBox(
            width: 30,
            height: 30,
            child: DecoratedBox(
              decoration: BoxDecoration(color: Colors.red),
            ),
          ),
          getUnconstrainedImage(),
        ],
      )
    ],
  );
}

Widget getConstrainedImage() {
  return ConstrainedBox(
    constraints: const BoxConstraints(minHeight: 100, minWidth: 100),
    child: SizedBox(
      // 虽然这个组件已经规定大小是30，但还是会因为父组件Box的强制要求变成100...跟安卓很不一样呢
      width: 30,
      height: 30,
      child: Image.asset('images/ic_wx_logo.webp'),
    ),
  );
}

Widget getUnconstrainedImage() {
  return ConstrainedBox(
      constraints: const BoxConstraints(minHeight: 100, minWidth: 100),
      child: UnconstrainedBox(
        child: SizedBox(
          // 虽然这个组件已经规定大小是30，但还是会因为父组件Box的强制要求变成100...跟安卓很不一样呢
          width: 30,
          height: 30,
          child: Image.asset('images/ic_wx_logo.webp'),
        ),
      ));
}
